@use "@/common/styles/colors"

.organization-audit-settings
  padding: 1rem
  border-radius: 0.5rem

  .settings-header
    display: flex
    align-items: center
    gap: 1rem
    margin-bottom: 2rem

    svg
      width: 2rem
      height: 2rem
      color: colors.$primary

    h3
      margin: 0
      color: colors.$white
      font-size: 1.25rem

    p
      margin: 0.25rem 0 0 0
      color: colors.$subtext
      font-size: 0.9rem

  .settings-content
    display: flex
    flex-direction: column
    gap: 2rem

    .setting-section
      .section-header
        margin-bottom: 1.5rem

        h4
          margin: 0
          color: colors.$white
          font-size: 1rem

        p
          margin: 0.25rem 0 0 0
          color: colors.$subtext
          font-size: 0.9rem

      .setting-item
        display: flex
        justify-content: space-between
        align-items: flex-start
        padding: 1rem
        background-color: colors.$dark-gray
        border: 1px solid colors.$gray
        border-radius: 0.5rem
        margin-bottom: 1rem

        .setting-info
          flex: 1
          margin-right: 1rem

          .setting-label
            display: block
            color: colors.$white
            font-weight: 600
            font-size: 0.95rem
            margin-bottom: 0.5rem

          .setting-description
            display: block
            color: colors.$subtext
            font-size: 0.85rem
            line-height: 1.4

  .settings-actions
    margin-top: 2rem
    padding-top: 1.5rem
    border-top: 1px solid colors.$gray
    display: flex
    justify-content: flex-end